<template>
    <div id="wonderful-item">
        <div class="box-image">
            <img src="image/y.svg"/>
        </div>
        <div class="text-describe">
           <span class="image-count">
               共15张图片
           </span>
            <span class="create-time">
                2017/11/09
           </span>
        </div>
        <div class="description">
                2019年8月26日云台山研学游记
            </div>

    </div>
</template>

<script>
    export default {
        name: "WonderfulItem"
    }
</script>

<style lang="less">
    #wonderful-item {
        margin-left: 20px;
        img {
            width: 122px;
            height: 125px;
            font-size: 122px;
            transform: scaleY(1.0174779483828815);
            -webkit-transform: scaleY(1.0174779483828815);
            color: rgba(67, 153, 222, 1);
            margin-left: 35px;
        }
        .text-describe{
            width: 196px;
            height: 34px;
            color: rgba(255, 255, 255, 1);
            background-color: rgba(153, 153, 153, 1);
            font-size: 12px;
            line-height: 150%;
            text-align: center;
            font-weight: bold;
            .image-count{
                line-height: 30px;
                text-align: center;
            }
        }
        .description{
            width: 196px;
            height: 28px;
            color: rgba(80, 80, 80, 1);
            font-size: 12px;
            line-height: 150%;
            text-align: center;
            margin-top: 10px;
        }
    }
</style>
